// src/components/ContentDistribution/PublishTaskList.jsx
import React, { useState } from 'react';
import { Table, Tag, Button, Popconfirm, Tooltip, Card } from 'antd';
import {
  EyeOutlined, EditOutlined, DeleteOutlined,
  SyncOutlined, CheckCircleOutlined, CloseCircleOutlined,
    SolutionOutlined, TeamOutlined, UserOutlined
} from '@ant-design/icons';

const PublishTaskList = () => {
  const [tasks, setTasks] = useState([
    {
      id: '1',
      content: '销售报告',
      targetType: 'role',
      target: ['manager', 'sales'],
      schedule: ['2023-11-20 09:00', '2023-11-27 18:00'],
      status: 'completed',
      createdBy: '管理员',
      createdAt: '2023-11-15 14:30',
      completedAt: '2023-11-15 15:15'
    },
    {
      id: '2',
      content: '客户分析',
      targetType: 'department',
      target: ['sales', 'marketing'],
      schedule: ['2023-11-22 10:00', '2023-11-29 18:00'],
      status: 'processing',
      createdBy: '管理员',
      createdAt: '2023-11-16 09:45',
      completedAt: null
    },
    {
      id: '3',
      content: '财务汇总',
      targetType: 'user',
      target: ['user1', 'user3'],
      schedule: ['2023-11-18 14:00', '2023-11-25 18:00'],
      status: 'failed',
      createdBy: '管理员',
      createdAt: '2023-11-17 11:20',
      completedAt: '2023-11-17 11:45'
    }
  ]);

  const handleDelete = (id) => {
    setTasks(tasks.filter(task => task.id !== id));
  };

  const handleRetry = (id) => {
    // 重试失败的任务
    setTasks(tasks.map(task =>
      task.id === id ? { ...task, status: 'processing' } : task
    ));
  };

  const columns = [
    {
      title: '发布内容',
      dataIndex: 'content',
      key: 'content',
      render: (text) => <strong>{text}</strong>
    },
    {
      title: '目标群体',
      dataIndex: 'target',
      key: 'target',
      render: (target, record) => {
        let icon, label;
        if (record.targetType === 'role') {
          icon = <SolutionOutlined />;
          label = '角色: ' + target.join(', ');
        } else if (record.targetType === 'department') {
          icon = <TeamOutlined />;
          label = '部门: ' + target.join(', ');
        } else {
          icon = <UserOutlined />;
          label = '用户: ' + target.join(', ');
        }

        return (
          <div>
            {icon} {label}
          </div>
        );
      }
    },
    {
      title: '发布时间',
      dataIndex: 'schedule',
      key: 'schedule',
      render: (schedule) => (
        <div>
          <div>开始: {schedule[0]}</div>
          <div>结束: {schedule[1]}</div>
        </div>
      )
    },
    {
      title: '状态',
      dataIndex: 'status',
      key: 'status',
      render: (status) => {
        let color, icon, text;
        switch (status) {
          case 'completed':
            color = 'green';
            icon = <CheckCircleOutlined />;
            text = '已完成';
            break;
          case 'processing':
            color = 'blue';
            icon = <SyncOutlined spin />;
            text = '进行中';
            break;
          case 'failed':
            color = 'red';
            icon = <CloseCircleOutlined />;
            text = '失败';
            break;
          default:
            color = 'default';
            text = status;
        }

        return (
          <Tag icon={icon} color={color}>
            {text}
          </Tag>
        );
      }
    },
    {
      title: '创建信息',
      dataIndex: 'createdBy',
      key: 'createdBy',
      render: (createdBy, record) => (
        <div>
          <div>创建人: {createdBy}</div>
          <div>时间: {record.createdAt}</div>
        </div>
      )
    },
    {
      title: '操作',
      key: 'action',
      render: (_, record) => (
        <div style={{ display: 'flex', gap: 8 }}>
          <Tooltip title="查看详情">
            <Button icon={<EyeOutlined />} size="small" />
          </Tooltip>

          <Tooltip title="编辑">
            <Button icon={<EditOutlined />} size="small" />
          </Tooltip>

          {record.status === 'failed' && (
            <Tooltip title="重试">
              <Button
                icon={<SyncOutlined />}
                size="small"
                onClick={() => handleRetry(record.id)}
              />
            </Tooltip>
          )}

          <Popconfirm
            title="确定删除此任务吗？"
            onConfirm={() => handleDelete(record.id)}
          >
            <Tooltip title="删除">
              <Button icon={<DeleteOutlined />} size="small" danger />
            </Tooltip>
          </Popconfirm>
        </div>
      )
    }
  ];

  return (
    <Card
      title="发布任务管理"
      extra={
        <Button type="primary">
          新建发布任务
        </Button>
      }
    >
      <Table
        columns={columns}
        dataSource={tasks}
        rowKey="id"
        pagination={{ pageSize: 5 }}
      />
    </Card>
  );
};

export default PublishTaskList;
